<template>
  <div class="xtx-home-page">
    <div class="container">
      <home-category />
      <XtxCarousel :sliders="sliders" />
      <homeNew />
      <homeHot />
    </div>
  </div>
</template>

<script>
import { reactive } from 'vue'
import homeCategory from './components/home-category.vue'
import homeNew from './components/home-new.vue'
import homeHot from './components/home-hot.vue'
import { findBanner } from '@/api/home'
export default {
  name: 'xtx-home-page',
  components: {
    homeCategory,
    homeNew,
    homeHot
  },
  setup () {
    const sliders = reactive([])
    findBanner().then(res => {
      sliders.push(...res.result)
    })
    return {
      sliders
    }
  }
}
</script>

<style scoped lang="less"></style>
